<template>
  <div class="myTable">
    <p style="font-size: 20px">基础表格</p>
    <el-card shadow="hover" style="margin-top: 10px"
      ><custom-table
        :column="column"
        :tableConfig="tableConfig"
        @row-dblclick="rowDblClick"
        @current-change="currentChange"
        @checkBox-change="checkBoxChange"
        @page-change="pageChange"
      >
      </custom-table>
      <div>
        <pre v-highlight>
        <code class="lang-javascript">
          'div'
        </code>
        </pre>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  name: "router",
  data() {
    return {
      form: {},
      column: [
        {
          prop: "name",
          label: "姓名",
          width: "200",
        },
        {
          prop: "date",
          width: "200",
          label: "日期",
        },
        {
          prop: "address",
          label: "地址",
          width: "",
        },
      ],
      tableConfig: {
        height: "",
        useIndex: false,
        useMultiSelect: false,
        showPagination: false,
        data: [
          {
            date: "2016-05-02",
            name: "王小虎",
            address: "上海市普陀区金沙江路 1518 弄",
          },
          {
            date: "2016-05-04",
            name: "王小虎",
            address: "上海市普陀区金沙江路 1517 弄",
          },
          {
            date: "2016-05-01",
            name: "王小虎",
            address: "上海市普陀区金沙江路 1519 弄",
          },
          {
            date: "2016-05-03",
            name: "王小虎",
            address: "上海市普陀区金沙江路 1516 弄",
          },
        ],
      },
    };
  },
  methods: {
    rowDblClick(row, column, event) {
      console.log(row, column, event);
    },
    checkBoxChange(selection, row) {
      console.log(selection, row);
    },
    currentChange(current) {},
    pageChange(pageSize) {
      console.log(pageSize);
    },
  },
  mounted() {},
};
</script>

<style>
.myTable {
  /* user-select: none;
  user-zoom: 0;
  -webkit-user-drag: none; */
}
</style>
